<template>
  <el-dialog v-model="ShowOrderFlowDialog" title="流程记录" width="1100">
    <el-table v-loading="listLoading" :data="OrderFlowList">
      <el-table-column
        align="center"
        label="流程ID"
        prop="OrderFlowID"
        show-overflow-tooltip
        width="80"
      />
      <el-table-column
        align="center"
        label="操作时间"
        prop="addTime"
        show-overflow-tooltip
        width="200"
      />
      <el-table-column
        align="center"
        label="操作人"
        prop="FlowStaffName"
        show-overflow-tooltip
        width="100"
      />
      <el-table-column
        align="center"
        label="操作"
        prop="OrderFlowName"
        show-overflow-tooltip
        width="200"
      />
      <el-table-column
        align="left"
        label="备注"
        prop="ReturnReason"
        show-overflow-tooltip
      />
    </el-table>
  </el-dialog>
</template>

<script>
  export default defineComponent({
    name: 'ShowFlow',
    setup() {
      const state = reactive({
        listLoading: true,
        OrderFlowList: [],
        ShowOrderFlowDialog: false,
      })

      const showList = (OrderFlowList) => {
        state.OrderFlowList = OrderFlowList
        state.listLoading = false
        state.ShowOrderFlowDialog = true
      }
      return {
        ...toRefs(state),
        showList,
      }
    },
  })
</script>
